
<?php if ($conectado): ?>
<div id="contenedor_subir_video">
<h1 style="font-size: 34px">Subir un nuevo Video</h1>

<div id="div_form_video">
    <form onsubmit="return(check_form());" method="post" name="form_video" id="form_video" action="<?php echo url_for("video/saveUpload"); ?>">
    
    <h1 style="position:absolute;left: 20px">1&nbsp;&nbsp;&nbsp;&nbsp;Selecciona la prueba, la materia y el tema del video</h1>
    <div style="position:absolute;left: 15px; top: 100px; width: 180px">
        <object data="/images/vectorial/1marcado.svg" type="image/svg+xml"></object>
    </div>
    <div id="div_select_tema" style="position:absolute; top: 200px;left: 150px">
            <input type="hidden" name="fb_id" id="fb_id" value="<?php echo $fb_id; ?>">
            <input type="hidden" name="tema_id_2" id="tema_id_2" value="" >
            <div id="div_prueba">
            </div>
            <div id="div_error_select" style="color:red; position: absolute; top: 50px; left: 120px; width: 400px">

            </div>
    </div>
    <h2 id="div_seleccionado_tema" style="position: absolute; top: 150px; left: 200px; color:#ccc; font-size: 30px">
    </h2>

    <div id="div_select_get_or_upload" style="display:none;position: absolute;">
        <h1 style="position: absolute; top: 150px; width: 600px">2&nbsp;&nbsp;&nbsp;&nbsp;Selecciona el método para subir el video</h1>
        <div style="position:absolute;left: 15px; left: -10px; top: 140px; width: 180px">
            <object data="/images/vectorial/2marcado.svg" type="image/svg+xml"></object>
        </div>
        <div style="position: absolute; top: 230px; left: 150px; width: 600px; font-size: 16px">
            <input type="radio" name="select_get_or_upload" id="select_get_or_upload_1" value="1" onclick="cambiar(1);">&nbsp;&nbsp;Subir un nuevo video a Youtube
            <br>
            <input type="radio" name="select_get_or_upload" id="select_get_or_upload_2" value="2" onclick="cambiar(2);">&nbsp;&nbsp;Agregar un video ya existente desde Youtube
        </div>
    </div>

    <div id="div_upload_video" style="display:none;position: absolute; top: 420px;">
        <h1>3&nbsp;&nbsp;&nbsp;&nbsp;Selecciona el archivo</h1>
        <div style="position:absolute;left: 15px; left: -10px; top: -10px; width: 180px">
            <object data="/images/vectorial/3marcado.svg" type="image/svg+xml"></object>
        </div>
        <iframe style="border:0px; margin: 0px; padding: 0px; position: absolute; left: 155px; background-color: #FCFCFC; height: 60px " frameborder="0" src="<?php echo url_for("video/uploadFrame")."?tokenValue=".$tokenValue."&postUrl=".$postUrl;?>" width="100%" height="40px;">
        </iframe>
    </div>
    <div id="terminar_ingreso" style="display:none;position: absolute; top: 420px;">
        <div id="div_ingresa_codigo" style="display: none;">
            <h1>3&nbsp;&nbsp;&nbsp;&nbsp;Ingresa la url de youtube del video y apreta en Guardar para finalizar</h1>
            <div style="position:absolute;left: 15px; left: -10px; top: -10px; width: 180px">
                <object data="/images/vectorial/3marcado.svg" type="image/svg+xml"></object>
            </div>
            <div style="padding-left:50px; color:#fcfcfc; position: absolute; left: 110px ">
                <input type="text" id="youtube_url" name="youtube_url" value="" onchange="checkUrl()" size="50">
                <span id="mensaje_url" style="font-weight: bold; font-style: italic; color: red">
                </span>
            </div>
        </div>
        <div id="div_finaliza" style="display: none;">
            <h3>4&nbsp;&nbsp;&nbsp;&nbsp;Tu video ha sido subido, apreta en Guardar Video para finalizar</h3>

            <div style="padding-left:50px; color:#999999;">

                <div style="padding-left:50px; color:#999999;">
                    <input type="hidden" id="youtube_id" name="youtube_id" value="">
                </div>
            </div>
        </div>
        <div>
            <input  class="botonSeleccionarTema" style="left: 160px; top: 80px; min-height: 35px" type="submit" value="Guardar Video" name="finalizar">
        </div>
        
    </div>
    </form>
</div>
</div>
<script>
    callUrl('div_prueba','<?php echo url_for("prueba/selectPrueba"); ?>');
    function seleccionarVideo(){
        var tema=$("#tema_id");
        if(tema.val()){
            $("#div_error_tema").html("");
            
            $("#div_select_tema").hide();
            $("#tema_id_2").val(tema.val());
            $("#div_seleccionado_tema").html("Tema: "+tema.text());

            $("#div_select_get_or_upload").slideDown('slow');
            
        }
        else{
            $("#div_error_select").html("Debes seleccionar un tema antes de continuar");
        }

    }
    function checkUrl(){
        callUrl("mensaje_url","<?php echo url_for('video/retrievingVideoEntry')?>?url="+$("#youtube_url").val());
    }

    function check_form(){
        $("#error_url").html("");
        if($("#youtube_id").val()=="" && $("#youtube_url").val()==""){
            //alert("_2_");
            return false;
        }
        if($("#tema_id").val()==""){
            //alert("_3_");
            return false;
        }
        //alert("_1_");

       var tipo =$("#select_get_or_upload_2");
       //alert(tipo.attr('checked', true));
       if(tipo.is(':checked')){
           var resultado = $("#mensaje_url").html();
           if(resultado == "Video Ok"){

           }
           else{
               return false;
           }
       }

        //return true;
    }
    function alertar(id){
        $("#youtube_id").val(id);
        //$('#youtube_id').attr('disabled', true);
        $("#terminar_ingreso").show();

    }
    function enviarFormulario(){
        callFormAction(null,"<?php echo url_for("video/saveUpload"); ?>", "form_video")
    }
    var get_o_upload = 1;
    function cambiar(cual){
        if(cual==1){
             $("#div_upload_video").show();
             $("#terminar_ingreso").hide();
             $("#div_finaliza").show();
             $("#div_ingresa_codigo").hide();
        }
        else{
             $("#terminar_ingreso").show();
             $("#div_upload_video").hide();
             $("#div_ingresa_codigo").show();
             $("#div_finaliza").hide();
        }
    }
</script>
<?php else: ?>
<div id="contenedor_subir_video_sin_fb">
    <div style="padding: 50px;position: relative">
    <h1>¡Para subir un video, es necesario que inicies sesión con facebook!</h1>
    <div style="position:absolute;left: 150px; top: 100px; width: 200px">
        <object data="../images/vectorial/unaflecha.svg" type="image/svg+xml"></object>
    </div>

    <a id="botonFacebookLogin2" href="" class="boton_facebook" style="position: absolute;left: 300px; top: 110px; width: 200px">Iniciar sesión con facebook</a>

    <script type="text/javascript">
        var pathname = window.location;
        $('#botonFacebookLogin2').attr('href', '<?php echo url_for('facebook/fbLogin').'?url=' ?>'+pathname);
    </script>

    </div>
</div>
<?php endif; ?>
